<template>
	<view>
		<view class="lb-main-32">
			<u-empty v-if="listData.length < 1" mode="data" text="暂无数据" icon="/static/empty/data.png"></u-empty>
			<view class="lb-box" v-for="(item,index) in listData" @click="goTo(item.id)" :key="index">
				<view class="lb-item">
					<u-icon name="volume-fill" color="#2979ff" size="24"></u-icon>
					<view class="title">{{item.title}}</view>
				</view>
				<view class="time">{{item.createtime}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		noticeList
	} from "@/api/apis/comm.js"
	import {
		setImgUrl,
		fmtFormat
	} from "@/utils/comm.js"
	export default {
		data() {
			return {
				listData: [],
			}
		},

		methods: {
			//跳转
			goTo(id) {
				uni.navigateTo({
					url: '/pages/channel/notice/detail?id=' + id
				})
			},
			getImgUrl(url) {
				return setImgUrl(url);
			},
			//列表
			getList() {
				noticeList().then(res => {
					this.listData = res.data
				})
			},
		},
		onLoad() {
			this.getList();
		},
		onReachBottom() {
			//注意 这里是重要的一步，不满足条件下拉加载不能继续请求数据
			if (!this.isLoading) {
				this.getList();
			}

		},
	}
</script>

<style lang="scss">
	.lb-box {
		background: rgba(255, 255, 255, 1);
		box-shadow: 0rpx 2rpx 4rpx rgba(0, 0, 0, 0.16);
		border-radius: 16rpx;
		padding: 12rpx 24rpx;
		box-sizing: border-box;
		margin-bottom: 30rpx;

		.lb-item {
			display: flex;
			align-items: center;
			color: #333;
			font-size: 30rpx;
			margin-bottom: 10rpx;

			.title {
				margin-left: 15rpx;
			}
		}

		.time {
			font-size: 28rpx;
			color: #666;
		}
	}
</style>